<template>
  <a-modal title-align="start" title="评价" :mask-closable="false" v-model:visible="showvisible" @cancel="showvisible = false" :width="500">
    <div>请对本次任务服务方做个简单的评价</div>
    <div class="mt10 mb10">
      <a-space>
        <div>评分：</div>
        <a-rate v-model="form.evaluationLevel" :count="10" allow-half />
        <div>{{ form.evaluationLevel }}</div>
      </a-space>
    </div>
    <div>
      <a-textarea v-model="form.evaluation" placeholder="展开说说你对本次服务的看法" allow-clear />
    </div>
    <template #footer class="modal-footer">
      <a-button @click="showvisible = false">取消</a-button>
      <a-button type="primary" :loading="loading" @click="submit">确定</a-button>
    </template>
  </a-modal>
</template>

<script lang="ts" setup>
  import { defineComponent, ref, computed } from 'vue'
  import { evaluateTask } from '@/api/task'
  import { Message } from '@arco-design/web-vue'
  let props = defineProps(['modelValue', 'type', 'info'])
  let emits = defineEmits(['save', 'update:modelValue'])
  let showvisible = computed({
    get() {
      return props.modelValue
    },
    set(val) {
      emits('update:modelValue', val)
    },
  })
  let form: any = ref({})
  let loading = ref(false)
  const submit = async () => {
    if (!form.value.evaluationLevel) return Message.error('请填写评分')

    let params = {
      ...form.value,
      idList: [props.info.id],
    }

    try {
      loading.value = true
      const res: any = await evaluateTask(params)
      if (res) {
        showvisible.value = false
        Message.success('评价成功')
        emits('save')
      }
    } catch (error) {}
    loading.value = false
  }
</script>

<style lang="less" scoped></style>
